﻿<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>

<fmt:setBundle basename="ApplicationMessage" />


<!DOCTYPE html>
<html lang="zh-CN">
<head>

  <%@ include file="/WEB-INF/include/meta.jsp"%>
  <%@ include file="/WEB-INF/include/css.jsp"%>

</head>

<body class="ihg-theme-draft">

  <%@ include file="/WEB-INF/include/header.jsp"%>
  <jsp:include page="/WEB-INF/include/submenu-session.jsp">
    <jsp:param name="currentUrl" value="${ctx.host}/sessions/${session.id}" />
  </jsp:include>

  <div class="container-fluid ihg-container has-ihg-sidemenu">

    <div class="ihg-breadcrumb">
      <ol class="breadcrumb border-breadcrumb">
        <li class="active">Orientation Call Management</li>
      </ol>
      <div class="pull-right">
        <a href="${ctx.host}/active-sessions" style="color: #155CB2;"><<&nbsp;Go Back List</a>
      </div>
    </div>

    <div class="ihg-content-layout has-operation">
      <div class="row">
        <div class="col-xs-12">
          <ul class="nav nav-tabs" role="tablist" style="margin-top: 20px;">
            <li class="active"><a href="${ctx.host}/sessions/${session.id}/orientations">Orientation</a></li>
            <li><a href="${ctx.host}/sessions/${session.id}/who-i-know">Who I Know</a></li>
          </ul>

          <div class="tab-content" style="margin-top: 25px;">

            <div class="tab-pane active">

              <div class="row">
                <div class="col-xs-6">
                  <div class="panel panel-default ihg-panel" style="min-height: 530px;">
                    <div class="panel-heading">
                      <span class="panel-titles text-success" style="font-size: 13px; font-weight: bold;"><i class="glyphicon glyphicon-th-large" style="top: 2px;"></i>&nbsp;&nbsp;Assessor Orientation call</span>
                      <div class="pull-right">
                        <a href="${ctx.host}/sessions/${session.id}/orientations/${assessorMeeting.id}/edit-date" data-target="#edit-date" data-toggle="modal">Edit Date</a>
                      </div>
                    </div>
                    <div class="panel-body" style="padding: 15px 0;">
                      <div class="form-horizontal ihg-form">

                        <div class="form-group ihg-form-group">
                          <label class="control-label col-xs-3">Date :</label>
                          <div class="col-xs-7">
                            <p class="form-control-static">
                              <fmt:formatDate value="${assessorMeeting.startTime}" pattern="yyyy-MM-dd HH:mm" />&nbsp;&nbsp;~&nbsp;&nbsp;<fmt:formatDate value="${assessorMeeting.endTime}" pattern="yyyy-MM-dd HH:mm" />
                            </p>
                          </div>
                        </div>

                        <div class="form-group ihg-form-group">
                          <label class="control-label col-xs-3">Webex Link:</label>
                          <div class="col-xs-6">
                            <p class="form-control-static">
                              <a href="${assessorMeeting.conferenceRoom.url}"  target="_blank">Link</a>
                            </p>
                          </div>
                        </div>

                        <div class="form-group ihg-form-group">
                          <label class="control-label col-xs-3">Webex Code:</label>
                          <div class="col-xs-3">
                            <p class="form-control-static">${assessorMeeting.conferenceRoom.account}</p>
                          </div>
                          <label class="control-label col-xs-3">Zoom Password:</label>
                          <div class="col-xs-3">
                            <p class="form-control-static">${assessorMeeting.conferenceRoom.password}</p>
                          </div>
                        </div>

                        <div class="form-group ihg-form-group">
                          <label class="control-label col-xs-3">Meeting Host :</label>
                          <div class="col-xs-3">
                            <p class="form-control-static">${session.sessionHost.name}</p>
                          </div>
                        </div>

                        <div class="form-group ihg-form-group">
                          <label class="control-label col-xs-3">Assessor :</label>
                          <div class="col-xs-7">
                            <p class="form-control-static clearfix">
                              <c:forEach var="assessor" items="${assessors}">
                                <span class="label label-default pull-left" style="margin: 0 5px 10px 0;">${assessor.name}</span>
                              </c:forEach>
                            </p>
                          </div>
                        </div>

                        <div class="form-group ihg-form-group">
                          <label class="control-label col-xs-3">Wechat Group :</label>
                          <div class="col-xs-3">
                            <img src="${session.assessorWechatGroup}" style="display: block; width: 150px; height: 150px; border: 1px solid #ccc;">
                          </div>
                        </div>

                      </div>
                    </div>
                  </div>
                </div>
                <div class="col-xs-6">

                  <div class="panel panel-default ihg-panel" style="min-height: 530px;">
                    <div class="panel-heading">
                      <span class="panel-titles text-success" style="font-size: 13px; font-weight: bold;"><i class="glyphicon glyphicon-th-large" style="top: 2px;"></i>&nbsp;&nbsp;Delegate Orientation call</span>
                      <div class="pull-right">
                        <a href="${ctx.host}/sessions/${session.id}/orientations/${delegateMeeting.id}/edit-date" data-target="#edit-date" data-toggle="modal">Edit Date</a>
                      </div>
                    </div>
                    <div class="panel-body" style="padding: 15px 0;">
                      <div class="form-horizontal ihg-form">

                        <div class="form-group ihg-form-group">
                          <label class="control-label col-xs-3">Date :</label>
                          <div class="col-xs-7">
                            <p class="form-control-static">
                              <fmt:formatDate value="${delegateMeeting.startTime}" pattern="yyyy-MM-dd HH:mm" />&nbsp;&nbsp;~&nbsp;&nbsp;<fmt:formatDate value="${delegateMeeting.endTime}" pattern="yyyy-MM-dd HH:mm" />
                            </p>
                          </div>
                        </div>

                        <div class="form-group ihg-form-group">
                          <label class="control-label col-xs-3">Zoom Link:</label>
                          <div class="col-xs-6">
                            <p class="form-control-static">
                              <a href="${delegateMeeting.conferenceRoom.url}"  target="_blank">Link</a>
                            </p>
                          </div>
                        </div>

                        <div class="form-group ihg-form-group">
                          <label class="control-label col-xs-3">Account:</label>
                          <div class="col-xs-3">
                            <p class="form-control-static">${delegateMeeting.conferenceRoom.account}</p>
                          </div>
                          <label class="control-label col-xs-3">Password:</label>
                          <div class="col-xs-3">
                            <p class="form-control-static">${delegateMeeting.conferenceRoom.password}</p>
                          </div>
                        </div>

                        <div class="form-group ihg-form-group">
                          <label class="control-label col-xs-3">Meeting Host :</label>
                          <div class="col-xs-3">
                            <p class="form-control-static">${session.sessionHost.name}</p>
                          </div>
                        </div>

                        <div class="form-group ihg-form-group">
                          <label class="control-label col-xs-3">Delegate :</label>
                          <div class="col-xs-7">
                            <p class="form-control-static clearfix">
                              <c:forEach var="delegate" items="${delegates}">
                                <span class="label label-default pull-left" style="margin: 0 5px 10px 0;">${delegate.name}</span>
                              </c:forEach>
                            </p>
                          </div>
                        </div>
                        <div class="form-group ihg-form-group">
                          <label class="control-label col-xs-3">Wechat Group :</label>
                          <div class="col-xs-3">
                            <img src="${session.delegateWechatGroup}" style="display: block; width: 150px; height: 150px; border: 1px solid #ccc;">
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>

              </div>
            </div>

          </div>

        </div>

      </div>
    </div>


  </div>

  <%@ include file="/WEB-INF/include/footer.jsp"%>
  <%@ include file="/WEB-INF/include/script.jsp"%>
  <d:resource root="${ctx.resource}/build" type="script" src="js/page/session/preparation/orientation-list.js" />
  <script type="text/javascript">
      require([ 'page/session/preparation/orientation-list' ],
          function ( page ) {
            page.init();
          })
    </script>

</body>
</html>